@layout("/common/default.html",{title:'部门管理'}){


<table class="layui-hide" id="permissionTable" lay-filter="tableFilter"></table>


<!-- 行工具栏模板 -->
<script type="text/html" id="table-toolbar">
    <a class="llayui-btn layui-btn-primary layui-btn-xs layui-btn-radius" lay-event="edit"><i
            class="layui-icon layui-icon-edit"></i>编辑</a>

    <a class="layui-btn layui-btn-normal layui-btn-xs layui-btn-radius" lay-event="addnext"><i
            class="layui-icon layui-icon-add"></i>添加下级部门</a>

    {{# if(d.id==1){}}
    <a class="layui-btn layui-btn-disabled layui-btn-xs layui-btn-radius"><i
            class="layui-icon layui-icon-delete "></i>删除</a>
    {{#} else if(d.id!=1){}}
    <a class="layui-btn layui-btn-danger layui-btn-xs layui-btn-radius" lay-event="del"><i
            class="layui-icon layui-icon-delete"></i>删除</a>
    {{#} }}


</script>

<script>
    layui.use([  'form', 'laydate', 'openLayer', 'utils', 'feng','treetable'], function () {
        var  $ = layui.jquery,
            laydate = layui.laydate,
            openLayer = layui.openLayer,
            utils = layui.utils,
            feng = layui.feng,
            treetable= layui.treetable;


        // 渲染表格
        var renderTable = function () {//树桩表格参考文档：https://gitee.com/whvse/treetable-lay
            layer.load(2);
            treetable.render({
                elem: '#permissionTable',
                url: '/sys/office/officeData',
                tree: {
                    iconIndex: 0,           // 折叠图标显示在第几列
                    isPidData: true,        // 是否是id、pid形式数据
                    treeLevel: '3',         //展开层级
                    haveChildName: 'haveChild',
                    idName: 'id',  // id字段名称
                    pidName: 'parentId'     // pid字段名称

                },
                height: 'full-220',
                cols: [[
                    {field: 'name', title: '部门名称'},
                    {field: 'type', title: '部门类型', templet: function (d) {
                            return feng.getDictLabel('${fnc.getDictListJson("sys_office_type")}', d.type)
                        }
                    },
                    {field: 'grade', title: '部门等级', templet: function (d) {
                            return feng.getDictLabel('${fnc.getDictListJson("sys_office_grade")}', d.grade)
                        }
                    },
                    {title: "操作",  align: "center", fixed: "right", toolbar: "#table-toolbar"}
                ]],
                done: function (res, curr, count) {
                    layer.closeAll('loading');
                }
            });
        };
        renderTable();

        treetable.on("tool(permissionTable)", function (obj) {
            var data = obj.data;
            switch (obj.event) {
                case "addnext":
                    addnext(data.id);
                    break;
                case "edit":
                    edit(data.id);
                    break;
                case "del":
                    del(data.id);
                    break;
            }
        });


        function addnext(id) {
            openLayer.opneAddNext({
                url:"/sys/office/form",
                value:id
            })
        }
        function edit(id) {
            openLayer.opneEdit({
                url:"/sys/office/form",
                value:id
            })
        }

        function del(id) {
            openLayer.confirm("确定要删除吗？", function () {
                utils.ajax("/sys/office/delete?id="+ id, "post").done(function (result) {
                    if(result.code=="0"){
                        utils.tableSuccessMsg(result.msg);
                    }else {
                        utils.tableSuccessMsg("删除失败");
                    }
                    renderTable();
                }).fail(function (error) {
                });
            })
        }
        //事件
        var active = {
            add: function () {
                openLayer.opneAdd({
                    url:"/sys/office/form"
                })
            },
        };
        $('[data-type]').click(function(){
            var type = $(this).data('type');
            active[type].call(this);
        });


    })
</script>

@}
